<script setup>
import {onMounted, ref} from "vue";
import {getUsersList} from "@/api/user.js";
import CardArea from "@/components/cardArea.vue";
import MyTable from "@/common/myTable.vue";


const pageData = ref({
  list: [],
  total: undefined,
})
const id = ref(undefined)
const actionFlag = ref(false)
//搜索条件
const searchData = ref({
  page: 1,
  size: 10,
})

onMounted(async () => {
  await getList()
})

const getList = async () => {
  const {data} = await getUsersList(searchData.value)
  pageData.value = data
}
const columns = [
  {key: 'selection', type: 'selection', width: '55px'},
  {key: 'id', title: 'id'},
  {key: 'avatar', title: '用户头像', type: 'img'},
  {key: 'nickname', title: '用户名',},
  {key: 'phone', title: '手机号',},
  {key: 'createdTime', title: '创建时间', width: '220px'},
  {key: 'lastLoginTime', title: '最后登录时间', width: '220px'},
]

</script>

<template>
  <card-area title="用户管理">
    <my-table v-model:search-data="searchData" :columns="columns" :list="pageData.list" :total="pageData.total"
              @load="getList">
    </my-table>
  </card-area>
</template>

<style scoped lang="scss">

</style>
